<template>
	<view class="app-my-give e-p-20">
		<view class="app-my-give__item e-radius-20 bg-white e-m-b-20 e-p-l-30 e-p-r-30 e-p-b-30" v-for="item in list" :key="item.id" @tap="$goTo('/pages/myGive/detail',{id:item.id,hadSendPeriod:item.hadSendPeriod})">
			<view class="e-flex e-p-t-24 e-p-b-22">
				<view class="e-flex-1 c-333 e-font-24 fw-500">
					订单号：{{item.orderId}}
				</view>
				<view class="e-flex">
					<view class="c-999 e-font-24 e-m-r-10">
						赠送活动明细
					</view>
					<image class="img-28" src="./static/arrow.jpg" mode=""></image>
				</view>
			</view>
			<view class="app-my-give__line e-m-b-20">
				
			</view>
			<view class="e-flex e-m-b-28">
				<view class="e-flex-1">
					<view class="e-font-24 c-999 e-m-b-8">
						预估赠送抵扣券
					</view>
					<view class="c-333 e-font-24">
						{{item.allSend}}
					</view>
				</view>
				<view class="e-flex-1">
					<view class="e-font-24 c-999 e-m-b-8">
						已赠送抵扣券
					</view>
					<view class="c-333 e-font-24">
						{{item.hadSendDeduction}}
					</view>
				</view>
			</view>
			<view class="e-flex">
				<view class="e-flex-1">
					<view class="e-font-24 c-999 e-m-b-8">
						最大赠送次数
					</view>
					<view class="c-333 e-font-24">
						{{item.allPeriod}}
					</view>
				</view>
				<view class="e-flex-1">
					<view class="e-font-24 c-999 e-m-b-8">
						已赠送次数
					</view>
					<view class="c-333 e-font-24">
						{{item.hadSendPeriod}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {ref} from 'vue'
	import { useCurrentInstance, useQueryPage } from '@/common/hooks';
	import { getProfitList } from '@/common/request/api';
	import { onLoad, onShow, onPullDownRefresh,onReachBottom } from '@dcloudio/uni-app';
	
	const ctx = useCurrentInstance();
	
	const { showLoad, list, handleQueryPage, handleRefresh } = useQueryPage({
		api: getProfitList,
		option: {
			responseKey:'data.list',
			totalKey:'data.total',
		},
		pageSize:10
	});
	
	onLoad(() => {
		handleRefresh()
	})
	onReachBottom(() => {
		handleQueryPage()
	})
</script>

<style lang="scss" scoped>
	@include appBem_b(my-give) {
		@include appBem_e(item) {
			
		}
		@include appBem_e(line) {
			border-bottom: 1rpx solid #F2F2F2;
		}
	};
</style>